<template>
  <!-- 物资入库模板 -->
  <el-row>
    <el-col :span="24">
      <table class="table-box">
        <thead>
          <tr>
            <th>序号</th>
            <th>商品名称</th>
            <th>单位</th>
            <th>生产厂商</th>
            <th><label style="color:red">*</label>数量</th>
            <th>零售价（￥）</th>
            <th>成本价（￥）</th>
            <th>成本合计（￥）</th>
            <th><label style="color:red">*</label>批号</th>
            <th><label style="color:red">*</label>有效期</th>
            <th><label style="color:red">*</label>发票号</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="(item,index) in itemList" :key="index">
            <td v-if="!item.show" colspan="11">
              <el-select v-if="!item.show" @change="changeDurg(item)" style="width:100%;" v-model="item.durg" remote reserve-keyword filterable :remote-method="remoteMethod">
                <!-- <el-option v-for="(it,index) in xyList" :key="index" :value="it" :label="it.name"></el-option> -->
                <el-option value :key="-1" label>
                  <p class="durg_title_box">
                    <span style="width:20%;display: inline-block;">药品名称</span>
                    <span style="width:20%;display: inline-block;">规格</span>
                    <span>生产厂家</span>
                  </p>
                </el-option>
                <el-option v-for="(it,index) in xyList" :key="index" :value="it">
                   <p class="durg_title_box">
                    <span  style="width:20%;display: inline-block;">{{it.name}}</span>
                    <span style="width:20%;display: inline-block;">{{it.specification}}</span>
                    <span>{{it.manufacturer}}</span>
                  </p>
                </el-option>
              </el-select>
            </td>
            <td v-if="item.show">{{index+1}}</td>
            <td v-if="item.show">{{item.sourceName}}</td>
            <td v-if="item.show">{{item.packUnit  | changeAssist(dwList) }}</td>
            <td v-if="item.show">{{item.factory}}</td>
            <td v-if="item.show">
              <el-input v-model.number="item.count" @blur="getCost(1,item)"></el-input>
            </td>
            <td v-if="item.show">{{item.retailPrice}}</td>
            <td v-if="item.show">
              <el-input v-model.trim="item.purchasePrice" @blur="getCost(2,item)"></el-input>
            </td>
            <td v-if="item.show">
              <el-input v-model.trim="item.purchaseMoney" @blur="getCost(3,item)"></el-input>
            </td>
            <td v-if="item.show">
              <el-input v-model.trim="item.lotNumber"></el-input>
            </td>
            <td v-if="item.show">
              <el-date-picker v-model="item.effectiveTime" type="date" placeholder="请选择有效期" value-format="yyyy-MM-dd">
              </el-date-picker>
            </td>
            <td v-if="item.show">
              <el-input v-model.trim="item.invoiceNumber" placeholder="请输入发票号"></el-input>
            </td>
            <td>
              <el-link type="danger" :underline="false" @click="removeItem(item,index)">删除</el-link>
            </td>
          </tr>
          <tr>
            <td colspan="7">合计成本</td>
            <td colspan="5">￥{{total}}</td>
          </tr>
        </tbody>
      </table>
    </el-col>
  </el-row>
</template>
<script>
export default {
  props: ["value", "itemList", "totalMoney"],
  data() {
    return {
      xyList: [],
      total: 0,
      dwList: []
    };
  },
  mounted() {
    let th = this;
    th.getDurg();
  },
  methods: {
    onDel(obj, index) {},
    getDurg() {
      let th = this;
      let json = { pageNum: 1, pageSize: 20, type: "2" };
      th.$api.pageQueryMaterialFee(json).then(res => {
        if (res.executed) {
          th.xyList = res.dataBody.list;
        }
      });
      th.getCommonConfigByKey("单位").then(res => {
        th.dwList = res;
      });
    },
    remoteMethod(query) {
      let th = this;
      let json = { pageNum: 1, pageSize: 20, type: "2", name: query };
      th.$api.pageQueryMaterialFee(json).then(res => {
        if (res.executed) {
          th.xyList = res.dataBody.list;
        }
      });
    },
    changeDurg(item) {
      let th = this;
      item.show = true;
      item.retailPrice = item.durg.sellMoney;
      item.sourceName = item.durg.name;
      item.factory = item.durg.manufacturer;
      item.retailPrice = item.durg.retailPrice;
      item.sourceId = item.durg.id;
      item.packUnit = item.durg.unit;
    },
    getCost(type, item) {
      let th = this;
      let intreg = /^\d+$/;
      if(item.count<0){
        item.count=0
      }
      if(!intreg.test(item.count)){
        item.count=0;
      }
      let reg = /^[0-9]+([.]{1}[0-9]+){0,1}$/;
      if (item.purchaseMoney !== "" && typeof item.purchaseMoney!="undefined") {
        if (!reg.test(item.purchaseMoney)) {
          item.purchaseMoney=0
        }
      }
      if (item.purchasePrice !== "" && typeof item.purchasePrice!="undefined") {
        if (!reg.test(item.purchasePrice)) {
          item.purchasePrice=0
        }
      }
      if (type == 1) {
        item.purchaseMoney = item.count * Number(item.purchasePrice);
        item.purchaseMoney = Number(item.purchaseMoney).toFixed(2);
      } else if (type == 2) {
        item.purchaseMoney = item.count * Number(item.purchasePrice);
        item.purchaseMoney = Number(item.purchaseMoney).toFixed(2);
      } else {
        item.purchasePrice = Number(item.purchaseMoney) / item.count;
        item.purchasePrice =item.purchasePrice.toFixed(2)
      }
      let sum = 0;
      for (let i = 0; i < th.itemList.length; i++) {
        if (th.itemList[i].purchaseMoney != 0) {
          sum += Number(th.itemList[i].purchaseMoney);
        }
      }
      th.total = sum.toFixed(2);
      th.$emit("getTotal", th.total);
    },
    removeItem(item, index) {
      let th = this;
      th.total = th.total - Number(item.purchaseMoney);
      th.total = th.total.toFixed(2);
      th.$emit("getTotal", th.total);
      th.itemList.splice(index, 1);
      th.$emit("input", th.itemList);
    }
  },
  watch:{
    totalMoney(n,o){
      let th=this;
      th.total=th.totalMoney;
    }
  }
};
</script>
<style lang="scss" scoped>
</style>
